<template>
  <div class="digital-cockpit">
    <!-- 顶部导航 -->
    <van-nav-bar
        title="配置说明"
        left-arrow
        @click-left="goBack"
        class="nav-bar"
    />
    <!-- 关键：添加 github-markdown 样式类，并通过 v-html 渲染 -->
    <div class="markdown-body" v-html="renderedMarkdown"></div>
  </div>
</template>

<script>
import { marked } from 'marked';
import hljs from 'highlight.js'; // 代码高亮库
import 'highlight.js/styles/github.css'; // 代码高亮样式（可选其他主题）
import 'github-markdown-css/github-markdown.css'; // GitHub 风格 Markdown 基础样式

export default {
  name: "ConfigurationDescription",
  data() {
    return {
      markdownContent: `

# 机器人消息接口文档



## POST 机器人文字消息

POST http://133.0.195.55:9997/weipu-boot/sys/chat/message/sendRobotText

> Body 请求参数

\`\`\`json
{
\t"message": "合肥今日天气：29度，大部分多云，降雨概率：60%"//消息内容
}
\`\`\`

### 请求参数

| 名称 | 位置  | 类型   | 必选 | 说明      |
| ---- | ----- | ------ | ---- | --------- |
| key  | query | string | 是   | 机器人key |

> 返回示例

> 200 Response

\`\`\`json
{
  "success": true,
  "message": "操作成功！",
  "code": 200,
  "result": "发送成功",
  "timestamp": 1756437007756
}
\`\`\`

### 返回结果

| 状态码 | 状态码含义                                              | 说明 | 数据模型 |
| ------ | ------------------------------------------------------- | ---- | -------- |
| 200    | [OK](https://tools.ietf.org/html/rfc7231#section-6.3.1) | none | Inline   |





## POST 机器人文件消息

POST http://133.0.195.55:9997/weipu-boot/sys/chat/message/sendRobotFile

> Body 请求参数

\`\`\`yaml
file: 二进制文件流
type: image
key: 97692117d67b13e09f3c59c87d22d2c8421d1a3fd29f

\`\`\`

### 请求参数

|名称|位置|类型|必选|说明|
|---|---|---|---|---|
|» file|body|file| 是 |每次只能传一个文件|
|» type|body|string| 是 |图片：image，文件：file|
|» key|body|string| 是 |机器人key|

> 返回示例

> 200 Response

\`\`\`json
{
  "success": true,
  "message": "操作成功！",
  "code": 200,
  "result": "发送成功",
  "timestamp": 1756435784687
}
\`\`\`

### 返回结果

|状态码|状态码含义|说明|数据模型|
|---|---|---|---|
|200|[OK](https://tools.ietf.org/html/rfc7231#section-6.3.1)|none|Inline|
`,
      renderedMarkdown: '',
      params:''
    };
  },
  mounted() {
    // 配置 marked，启用代码高亮
    marked.setOptions({
      highlight: function(code, lang) {
        // 如果指定了语言且hljs支持，则高亮；否则不高亮
        if (lang && hljs.getLanguage(lang)) {
          return hljs.highlight(code, { language: lang }).value;
        }
        return hljs.highlightAuto(code).value; // 自动检测语言
      },
      breaks: true, // 支持换行符
      gfm: true, // 启用 GitHub Flavored Markdown
      tables: true // 启用表格解析（默认开启）
    });

    // 解析 Markdown 并渲染
    this.renderedMarkdown = marked(this.markdownContent);

    this.params=this.$route.params;
  },
  methods:{
    goBack(){
      this.$router.push({name: 'robotDetail',params:this.params});
    }
  }
};
</script>

<style scoped>
/* 调整容器样式，避免内容过宽或溢出 */
.digital-cockpit {
  min-height: 100vh;
  background: #fff;
}

/* 关键：为 markdown-body 添加内边距和最大宽度，适配移动端 */
.markdown-body {
  padding: 15px; /* 内边距，避免内容贴边 */
  max-width: 800px; /* 最大宽度，防止在大屏上过宽 */
  margin: 0 auto; /* 居中显示 */
  box-sizing: border-box;
}

</style>
